<div class="completed" v-cloak>

    <div class="operation">
        <Row type="flex" justify="space-between" class="code-row-bg">
            <div>
                <nav>
                    <i-button><a href="#/main/to_complete">待完成订单</a></i-button>
                    <i-button><a href="#/main/completed">已完成订单</a></i-button>
                    <i-button><a href="#/main/uncomplete">未完成订单</a></i-button>
                </nav>
            </div>
            <div class="change-nav-right">
            <i-col span="6">
                <i-input v-model.trim="freightId" placeholder="请输入送货单号">
                    <i-button type="primary" slot="append" icon="ios-search" @click="query(1)">
                        搜索
                    </i-button>
            </i-col>
            <i-col>
                <i-button @click="selectAll" type="primary" style="margin-right:5px;">显示全部</i-button>
            </i-col>
            <i-col>
                <i-button @click="exportData" type="primary" style="margin-right:5px;">
                    <Icon type="ios-download-outline"></Icon>一键导出
                </i-button>
            </i-col>
        </div>
        </Row>
    </div>
    <div class="completed-table">
        <i-table style="margin-left:15px;" :loading="loading" :stripe="true" :columns="completedCl" :data="historyData"
            :border="true" height="800" ref="table">
        </i-table>
        <Row type="flex" justify="center">
            <div style="float: right;">
                <Page :total="dataCount" :page-size="pageSize" show-total show-elevator :current="1"
                    @on-change="changePage">
                </Page>
            </div>
        </Row>
    </div>
</div>
<script type="text/javascript" src="JS/page/delivery_note/completed.js"></script>
<style>
    .ivu-modal {
        top: 250px;
    }
    .change-nav-right{
        display: flex;
    }
</style>